import React, { Component, Fragment } from 'react';
import { connect } from 'dva';
import { Button, Result } from 'antd';
import router from 'umi/router';

let setTime: any;

interface noRightsProps {
  menu?: any;
}

interface noRightsState {
  timer: number;
}

@connect(({ menu }: any) => ({ menu }))

class NoRights extends Component<noRightsProps, noRightsState> {
  state = {
    timer: 3,
  }

  componentDidMount() {
    const { timer } = this.state;
    this.changeTimer(timer);
  }

  componentWillUnmount() {
    this.setState({ timer: 3 });
    window.clearTimeout(setTime);
  }

  changeTimer = (value: number) => {
    const { menu } = this.props;
    if (menu) {
      if (value < 1) {
        this.setState({ timer: 3 }, () => this.handleRouter());
      } else {
        setTime = setTimeout(() => {
          value -= 1;
          this.setState({
            timer: value,
          }, () => this.changeTimer(value));
        }, 1000);
      }
    }
  }

  handleRouter = () => {
    const { menu } = this.props;
    if (menu) router.push('/');
  }

  render() {
    const { timer } = this.state;

    return (
      <Result
        status="403"
        title="没有权限"
        subTitle="对不起，当前无权访问此页面!"
        extra={
          <Fragment>
            <p>{timer}s后跳转到首页</p>
            <Button type="primary" onClick={this.handleRouter}>
              返回首页
            </Button>
          </Fragment>
        }
      />
    );
  }
}

export default NoRights;
